<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        
        <title>byAMFI</title>
        
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/style.css" type="text/css"/>
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/style_1.css" type="text/css"/>
        <title>Products</title>
        <!--<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>-->
        <script  src="<%=request.getContextPath()%>/products/js/jquery.mobile-1.1.0.min.js"></script>
        <!-- include jQuery + carouFredSel plugin -->
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/idangerous.swiper.css">
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/style.css?v=1.8">
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/swiper-demos.css?v=1.8">
        <script  src="<%=request.getContextPath()%>/products/js/libs/jquery-1.7.1.min.js"></script>
        <!-- Swiper -->
        <script  src="<%=request.getContextPath()%>/products/js/idangerous.swiper-1.9.1.min.js"></script>
        <!-- Swiper Scrollbar plugin -->
        <script  src="<%=request.getContextPath()%>/products/js/idangerous.swiper.scrollbar-1.2.js"></script>
        <!-- Demos code -->
        <script  src="<%=request.getContextPath()%>/products/js/swiper-demos.js"></script>
        <link rel="stylesheet" href="<%=request.getContextPath()%>/style/jquery-ui.css" type="text/css" />
        <!--<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>-->
        <script  src="<%=request.getContextPath()%>/products/js/jquery-ui.js"></script>
       
        <script>  
            $(function()
            {
                $("#nextbt").toggle(
                
                function()
                {
                   $("#helpMe").hide(); 
                   $("#nextbt").val("Show");
                },
                function()
                {
                    $("#helpMe").show();
                    $("#nextbt").val("Hide");
                }); 
              });
        </script>
        
    </head>
    <body id="bodyHelp">
        
        
<!--        <div id="wrapper">-->
            <div id="header">
                    <div class="container">
                        
                        <div id="help">
                            <button class="btnhelp">help</button>
                        </div>
                        
                        
                        <div id="down">
                            <button class="btn2">Slide down</button>
                        </div>
                    
                        <div id="byAmfi"><h1>by AMFI</h1></div>
                        

                    </div><!-- container close -->
                </div> <!-- header close -->

            <div style=" padding-top: 300px; margin-left: auto; margin-right: auto; text-align: center;">
                <a href="products.jsp" >
                    <img src="/../style/images/button_newCategory.png" width="110" height="30""/>
                </a>
            </div>
                
<!--        </div>-->
        
<!--        <div>            
            <input type="button" id="nextbt" value="Hide">
        </div>
        <div id ="helpMe" style="position: absolute; width: 220px; height:30px;">
            test
        </div>-->
        
    </body>
</html>
